@charset "utf-8";

a.button {
    display: block;
    float: left;
    position: relative;
    height: 25px;
    width: 80px;
    margin: 0 10px 18px 0;
    
    text-decoration: none;
    font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold;
    line-height: 25px;
    text-align: center;
    
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px;
    border-radius: 3px;
  }

  a.button:before,
  a.button:after {
    content: '';
    position: absolute;
    left: -1px;
    height: 25px;
    width: 80px;
    bottom: -1px;
    
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px;
    border-radius: 3px;
  }

  a.button:before { 
    height: 23px;
    bottom: -4px;
    border-top: 0;
    
    -webkit-border-radius: 0 0 3px 3px; 
    -moz-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
    
    -webkit-box-shadow: 0 1px 1px 0px #1739a5;
    -moz-box-shadow: 0 1px 1px 0px #1739a5;
    
  }
  
  /* BLACK */
  a.black,
  a.black:hover,
  a.black:visited {
    color: #fff;
    border-bottom: 4px solid #1739a5;
    text-shadow: 0px 1px 0px #1739a5;
    
    background: #656565;
    background: -webkit-gradient(linear, left top, left bottom, from(#656565), to(#444));
    background: -moz-linear-gradient(top,  #656565,  #444);
    
    box-shadow: inset 1px 1px 0 #1739a5;
  }

  .black:before,
  .black:after {
    border: 1px solid #000;
    border-bottom: 1px solid #000;
  }

  .black:after { border: 1px solid #0000FF; }
  
  .black:before {
				box-shadow: 0 1px 1px 0px #6086ff;  
  }

  a.black:hover {
    background: #444;
    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#656565));
    background: -moz-linear-gradient(top,  #444,  #656565);
  }

  
/* DARK GRAY */
  a.darkgray,
  a.darkgray:hover,
  a.darkgray:visited {
    color: #555;
    border-bottom: 4px solid #878787;
    text-shadow: 0px 1px 0px #d6d6d6;
    
    background: #d1d1d1;
    background: -webkit-gradient(linear, left top, left bottom, from(#d1d1d1), to(#afafaf));
    background: -moz-linear-gradient(top,  #d1d1d1,  #afafaf);
    
    box-shadow: inset 1px 1px 0 #e3e3e3;
  }

  .darkgray:before,
  .darkgray:after {
    border: 1px solid #b4b4b4;
    border-bottom: 1px solid #7b7b7b;
  }

  a.darkgray:hover {
    background: #afafaf;
    background: -webkit-gradient(linear, left top, left bottom, from(#afafaf), to(#d1d1d1));
    background: -moz-linear-gradient(top,  #afafaf,  #d1d1d1);
  }
  
  a.button:active {
    border: none;
    bottom: -4px;
    margin-bottom: 22px;
    
    -webkit-box-shadow: 0 1px 1px #fff;
    -moz-box-shadow:  0 1px 1px #fff;
    box-shadow:  1px 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, 0.3);
  }

  a.button:active:before,
  a.button:active:after {
    border: none; 
    
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }

  /* MODERNIZR FALLBACK */
  .no-cssgradients a.button, .no-cssgradients a.button:visited,
  .no-borderradius a.button, .no-borderradius a.button:visited,
  .no-generatedcontent a.button, .no-generatedcontent a.button:visited {
    background: url(images/sprite.png) no-repeat 0 0px;
    height: 32px;
    width: 82px;
  }

  .no-cssgradients a.button:hover,
  .no-borderradius a.button:hover,
  .no-generatedcontent a.button:hover {
    background: url(images/sprite.png) no-repeat 0 -32px;
  }

  .no-cssgradients a.button:active,
  .no-borderradius a.button:active,
  .no-generatedcontent a.button:active {
    background: url(images/sprite.png) no-repeat 0 -64px;
    bottom: 0;
    line-height: 35px;
  }